<template>
	<view>
		<view style="height: 24rpx;width: 1rpx;"></view>
		<view @click="nearby" class="address" v-if="btnType == 1">{{info.address}}</view>
		
		<view class="info-box" style="margin-top: 24rpx" v-if="btnType == 2">
			<view class="info-each">
				<view class="" style="padding-bottom: 12rpx;">修改视频</view>
				<view class="" style="padding-bottom: 12rpx;">
					<text class="tint">视频要求真人出镜，在介绍中，可将您的业务场景和团队展现给客户，以增加用户对您的信服力，提高转化，我们也会将您的视频，发到各大视频平台，帮你免费拓客引流</text>
				</view>
			</view>
			<view class="upimg">
				<u-upload
					:fileList="fileList3"
					@afterRead="afterRead"
					@delete="deletePic"
					name="3"
					multiple
					:maxCount="1"
					accept="video"
				>
				<image src="../../static/imgs.png" mode="widthFix"
					style="width: 130rpx;height: 130rpx;">
				</image>
				</u-upload>
			</view>
		</view>
		<view class="info-box" style="margin-top: 24rpx" v-if="btnType == 2">
			<view class="info-each">
				<view class="" style="padding-bottom: 12rpx;">视频库视频</view>
				<view class="" style="padding-bottom: 12rpx;">
					<text class="tint">视频库的视频，主要用于各大平台的宣传，由于一条视频只能发布一次，为了更好的宣传效果，你可将内容相同的视频，以不同的角度或者调换顺序上传到视频库中，以便我们更好的为你宣传</text>
				</view>
			</view>
			<view class="upimg" style="margin-top: 24rpx;">
				<u-upload
					:fileList="fileList4"
					@afterRead="afterRead"
					@delete="deletePic"
					name="4"
					multiple
					:maxCount="6"
					accept="video"
				>
				<image src="../../static/imgs.png" mode="widthFix"
					style="width: 130rpx;height: 130rpx;">
				</image>
				</u-upload>
			</view>
		</view>
		
		<view class="btn" @click="amendAddress" v-if="btnType == 1">
			确定
		</view>
		
		<view class="btn" @click="amendVideo" v-if="btnType == 2">
			确定
		</view>
	</view>
</template>

<script>
	// #ifdef MP-WEIXIN
	const chooseLocation = requirePlugin('chooseLocation');
	// #endif
	
	// #ifdef APP
	import permision from "@/js_sdk/wa-permission/permission.js"
	// #endif
	export default {
		data() {
			return {
				info:{
					address:'',
				},
				fileList3: [],
				fileList4:[],
				btnType:''
			}
		},
		onLoad(option) {
			if(option.address){
				uni.setNavigationBarTitle({
					title: '位置更新'
				});
				this.info.address = option.address
				this.btnType = 1
			}
			if(option.video){
				uni.setNavigationBarTitle({
					title: '视频更新'
				});
				this.btnType = 2
				this.fileList3 = option.video.split(",").map(value => {
					return {
						url: this.oss(value),
						ful: value
					}
				})
			}
			console.log(option,'1111111111111')
			if(option.videos){
				this.fileList4 = option.videos.split(",").map(value => {
					return {
						url: this.oss(value),
						ful: value
					}
				})
			}
			console.log(this.fileList4,'2222222222222')
		},
		mounted() {
			let that = this
			// #ifdef APP
			
			uni.$on('selectAddress', function(data) {
				console.log(data)
				that.info.province = data.province
				that.info.city = data.city
				that.info.district = data.district
				that.info.lng = data.location.longitude
				that.info.lat = data.location.latitude
				that.info.address = data.address + data.name
				// this.address()
			})
			// #endif
		},
		onShow() {
			// #ifdef MP-WEIXIN
			const locations = chooseLocation.getLocation();
			console.log(locations)
			if (locations) {
				this.info.address = locations.name
				this.info.province = locations.province
				this.info.city = locations.city
				this.info.district = locations.district
				this.info.lat = locations.latitude
				this.info.lng = locations.longitude
				// this.address()
			}
			// #endif
		},
		methods: {
			amendVideo(){
				if(this.fileList3.length == 0) return uni.$u.toast('请上传视频')
				let video = [];
				this.fileList3.forEach(item => {
					video.push(item.url)
				})
				let videos = [];
				this.fileList4.forEach(item => {
					videos.push(item.url)
				})
				uni.$u.http.post('/user/editSkillVideo',{
					video:video.join(','),
					videos:videos.join(',')
				}).then(res => {
					if (res.code == 1) {
						this.$u.toast(res.msg);
						setTimeout(()=>{
							uni.navigateBack()
						},500)
					}
				}).catch((res) => {
				
				})
				
			},
			//修改位置信息
			amendAddress(){
				uni.$u.http.post('/updateplusinfo',{
					province:this.info.province,
					city:this.info.city,
					district:this.info.district,
					address:this.info.address
				}).then(res => {
					if (res.code == 1) {
						this.$u.toast(res.msg);
						setTimeout(()=>{
							uni.navigateBack()
						},500)
					}
				}).catch((res) => {
				
				})
			},
			nearby() {
				// #ifdef MP-WEIXIN
				const key = 'LNWBZ-4DTKU-JQCVV-23LKL-4GM2V-2RBQI'; //使用在腾讯位置服务申请的key
				const referer = '跑腿'; //调用插件的app的名称
				let location;
				if (this.info.lat) {
					location = JSON.stringify({
						latitude: this.info.lat,
						longitude: this.info.lng
					});
				} else {
					location = ''
				}
				console.log(location)
				const category = '';
			
				wx.navigateTo({
					url: 'plugin://chooseLocation/index?key=' + key + '&referer=' + referer + '&location=' +
						location + '&category=' + category
				});
				// #endif
			
				// #ifdef APP
			
				let allow = permision.checkSystemEnableLocation()
				if (allow) {
					uni.$u.route({
						url: 'pages/my/map'
					})
				} else {
					uni.showModal({
						title: '温馨提示',
						content: '请打开手机位置信息或点击下方确定开启APP权限中的位置信息',
						success: function(res) {
							if (res.confirm) {
								permision.gotoAppPermissionSetting()
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					});
				}
				// #endif
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1);
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file);
			
				let fileListLen = this[`fileList${event.name}`].length;
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					});
				})
			
			
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url);
			
					console.log(result)
			
			
					if (result) {
						let item = this[`fileList${event.name}`][fileListLen];
						this[`fileList${event.name}`].splice(
							fileListLen,
							1,
							Object.assign(item, {
								status: 'success',
								message: '',
								url: result.url
							})
						)
			
			
						fileListLen++;
					} else {
						this[`fileList${event.name}`].splice(fileListLen, 1);
					}
				}
				console.log(this[`fileList${event.name}`]);
			},
			uploadFilePromise(url) {
				console.log(url);
			
				let that = this;
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: that.Upload.uploadurl, // 仅为示例，非真实的接口地址
						filePath: url,
						name: 'file',
						formData: {
							type: 'image',
							token: uni.getStorageSync('token')
						},
						success: (res) => {
							let data = JSON.parse(res.data)
							if (res.statusCode === 200 && data.code === 1 && data.data) {
								resolve(data.data)
							} else {
								resolve()
							}
						}
					});
				});
			}
		}
	}
</script>

<style lang="scss">
.address {
	width: 658rpx;
	height: 100rpx;
	background: #F5F7F9;
	border-radius: 20rpx;
	margin: auto;
	padding: 0 24rpx;
	font-weight: 500;
	font-size: 30rpx;
	color: #A4A9B7;
	line-height: 100rpx;
}

.btn {
		width: 686rpx;
		height: 98rpx;
		background: #FEBF4E;
		border-radius: 49rpx 49rpx 49rpx 49rpx;
		margin: auto;
		font-weight: 500;
		font-size: 30rpx;
		color: #333333;
		line-height: 98rpx;
		text-align: center;
		margin-top: 143rpx;
	}
	
	
	.info-box {
		width: 622rpx;
		padding: 29rpx 32rpx;
		background: #ffffff;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		opacity: 1;
		margin: auto;
	
		.info-each {
			// display: flex;
			// justify-content: space-between;
			// align-items: center;
			font-size: 30rpx;
			font-weight: bold;
			color: #333333;
	
			.input {
				display: flex;
				align-items: center;
				text-align: right;
				font-size: 30rpx;
				font-weight: 500;
				color: #333333;
	
				text {
					display: inline-block;
					padding-left: 30rpx;
				}
			}
	
			image {
				width: 32rpx;
				height: 32rpx;
				position: relative;
				top: 7rpx;
				left: 20rpx;
			}
			.tint {
				font-size: 24rpx;
				font-weight: 500;
				color: #999999;
			}
		}
	}
</style>
